<template>
  <div class="app-container pull-height">
    <div>
      <el-tabs type="border-card">
        <!-- --------------------------------------------------------------第一模块----------------------- -->
        <el-tab-pane label="账号管理">
          <el-row
            style="background-color: white;position: relative;top: 10px; padding: 5px;"
          >
            <el-col :span="2" :offset="1">
              <el-button
                type="primary"
                size="medium"
                style="position: relative;top: 2px;"
                v-if="role.endsWith('m') || role.endsWith('manager')"
                @click="addCount()"
                >新增</el-button
              >
            </el-col>
            <el-col :span="13" :offset="7" class="radio-container">
              <el-radio-group
                v-model="radio"
                size="medium"
                style="position: relative;top: 4px;"
                @change="all"
              >
                <el-radio-button label="全部"></el-radio-button>
                <el-radio-button label="启用"></el-radio-button>
                <el-radio-button label="禁用"></el-radio-button>
              </el-radio-group>
              <el-input
                placeholder="请输入关键字"
                size="medium"
                v-model="input"
                clearable
                style="width: 250px; position: relative;top: 4px;left: 10px;"
              >
              </el-input>
              <el-button
                type="primary"
                size="medium"
                style="position: relative;top: 4px;left: 10px;"
                @click="searchAll()"
                >搜索</el-button
              >
            </el-col>
            <el-col :span="1">
              <i
                class="el-icon-refresh"
                style="font-size: 1.3em;position: relative;right: 65px;top: 10px;"
                @click="clearItem()"
              ></i>
            </el-col>
          </el-row>
          <!--                       ********表格**********                -->
          <el-row style="background-color: white;position: relative;top: 10px;">
            <el-col :span="22" :offset="1">
              <el-table :data="tableData">
                <!-- ----------------------展开行 -->
                <el-table-column type="expand">
                  <template slot-scope="props">
                    <el-form
                      label-position="left"
                      inline
                      class="demo-table-expand"
                    >
                      <el-form-item>
                        <span slot="label">
                          <span style="color: darkgray;font-size: 1.3em;"
                            >身份角色:</span
                          >
                        </span>
                        <span
                          v-for="(activity, index) in props.row.roleList"
                          :key="index"
                          >{{ activity.description }}</span
                        >
                      </el-form-item>
                      <el-form-item>
                        <span slot="label">
                          <span style="color: darkgray;font-size: 1.3em;"
                            >拥有的操作权限:</span
                          >
                        </span>
                        <div
                          v-for="(activity, index) in props.row.roleList"
                          :key="index"
                        >
                          <span
                            v-for="(activity2, index2) in activity.permsList"
                            :key="index2"
                            style="margin: 5px;padding: 5px;"
                            >{{ activity2.description }}</span
                          >
                        </div>
                      </el-form-item>
                    </el-form>
                  </template>
                </el-table-column>

                <!-- ----------------------表格中的数据 -->
                <el-table-column
                  prop="id"
                  label="账号id"
                  width="105"
                  align="center"
                ></el-table-column>
                <el-table-column
                  prop="account"
                  label="账户"
                  width="120"
                  align="center"
                ></el-table-column>
                <el-table-column
                  prop="cellphone"
                  label="手机号"
                  width="140"
                  align="center"
                ></el-table-column>
                <el-table-column
                  prop="department"
                  label="所属部门"
                  width="120"
                  align="center"
                ></el-table-column>
                <el-table-column label="状态" width="145" align="center">
                  <template slot-scope="{ row }">
                    <el-switch
                      active-color="#13ce66"
                      inactive-color="#ff4949"
                      v-model="row.status"
                      active-text="启用"
                      inactive-text="停用"
                      @change="modifyState(row)"
                      v-if="
                        role == 'manager' ||
                          (userAll.sid ==
                            row.sid &&
                            (role.endsWith('m')||role.endsWith('x')))
                      "
                    >
                    </el-switch>

                    <span
                      style="background-color: rgba(163, 221, 159, 0.841);font-size: 1.3em;"
                      v-if="
                        row.status &&
                          role != 'manager' &&
                          ((userAll.sid ==
                            row.sid &&
                            (role.endsWith('w')||role.endsWith('y')))||userAll.sid !=
                            row.sid)
                      "
                      >启用</span
                    >
                    <span
                      style="background-color: rgba(238, 109, 89, 0.653);font-size: 1.3em;"
                      v-if="
                        !row.status &&
                          role != 'manager' &&
                          ((userAll.sid ==
                            row.sid &&
                            (role.endsWith('w')||role.endsWith('y')))||userAll.sid !=
                            row.sid)
                      "
                      >禁用</span
                    >
                  </template>
                </el-table-column>
                <el-table-column
                  prop="time"
                  label="创建时间"
                  width="140"
                  align="center"
                ></el-table-column>
                <el-table-column
                  prop="aid"
                  label="操作员id"
                  width="100"
                  align="center"
                >
                </el-table-column>
                <el-table-column label="操作" align="center" width="180">
                  <template slot-scope="scope">
                    <el-button
                      @click="handleEdit(scope.row)"
                      v-if="
                        role == 'manager' ||
                          (userAll.sid ==
                            scope.row.sid &&
                            (role.endsWith('m')||role.endsWith('x')))
                      "
                      >编辑</el-button
                    >
                    <el-button
                      @click="handleDelete(scope.row)"
                      v-if="
                        role == 'manager' ||
                          (userAll.sid ==
                            scope.row.sid &&
                            (role.endsWith('m')||role.endsWith('x')))
                      "
                      >删除</el-button
                    >
                  </template>
                </el-table-column>
                <el-table-column align="center"
                  ><template slot-scope="scope">
                    <i
                      class="el-icon-search"
                      @click="searchHistory(scope.row)"
                    ></i>
                  </template>
                </el-table-column>
              </el-table>
            </el-col>
            <!-- --------------------------------------------分页 -->
            <el-col :span="18" :offset="3">
              <el-row>
                <template>
                  <div class="block">
                    <el-pagination
                      @size-change="handleSizeChange"
                      @current-change="handleCurrentChange"
                      :current-page="currentPage"
                      :page-sizes="[8, 16, 24, 32]"
                      :page-size="pageSize"
                      layout="prev, pager, next, jumper, sizes, total"
                      :total="tableTotal"
                    >
                    </el-pagination>
                  </div>
                </template>
              </el-row>
            </el-col>
          </el-row>
          <!--          ------------新增的弹框---------- -->
          <el-dialog title="新增用户" :visible.sync="dialogVisible" width="30%">
            <el-form ref="form" :model="form" label-width="120px">
              <el-form-item label="账号">
                <el-input
                  v-model="form.account"
                  placeholder="请输入账号"
                ></el-input>
              </el-form-item>
              <el-form-item label="密码">
                <el-input
                  v-model="form.password"
                  type="password"
                  placeholder="请输入密码"
                ></el-input>
              </el-form-item>
              <el-form-item label="手机号">
                <el-input
                  v-model="form.cellphone"
                  placeholder="请输入手机号"
                ></el-input>
              </el-form-item>
              <el-form-item label="归属部门">
                <el-select v-model="form.sid" placeholder="请选择部门">
                  <el-option
                    v-for="item in options"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item
                label="请选择账号身份"
                v-if="role.endsWith('manager')"
              >
                <el-radio-group v-model="form.identity">
                  <el-radio :label="1" v-if="form.sid != 1">普通文员</el-radio>
                  <el-radio :label="2" v-if="form.sid != 1">部门经理</el-radio>
                  <el-radio :label="3" v-if="form.sid == 1">管理层</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="dialogVisible = false">取消</el-button>
              <el-button type="primary" @click="submitForm">确定</el-button>
            </span>
          </el-dialog>

          <!--          ------------编辑的弹框---------- -->
          <el-dialog
            title="编辑用户信息"
            :visible.sync="dialogVisible2"
            width="30%"
          >
            <el-form ref="form" :model="form2" label-width="120px">
              <el-form-item label="账号">
                <el-input
                  v-model="form2.account"
                  placeholder="请输入新账号"
                ></el-input>
              </el-form-item>
              <!-- <el-form-item label="密码" v-if="role==manager">
                <el-input
                  v-model="form2.password"
                  type="password"
                  placeholder="请输入新密码"
                ></el-input>
              </el-form-item> -->
              <el-form-item label="手机号">
                <el-input
                  v-model="form2.cellphone"
                  placeholder="请输入新手机号"
                ></el-input>
              </el-form-item>
              <el-form-item
                label="归属部门"
                v-if="editSid != 1 || (editSid == 1 && managerNum != 1)"
              >
                <el-select v-model="form2.sid" placeholder="请选择新部门">
                  <el-option
                    v-for="item in options2"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item
                label="请选择账号身份"
                v-if="role.endsWith('manager') && managerNum != 1"
              >
                <el-radio-group v-model="form2.identity">
                  <el-radio :label="1" v-if="form2.sid != 1">普通文员</el-radio>
                  <el-radio :label="2" v-if="form2.sid != 1">部门经理</el-radio>
                  <el-radio :label="3" v-if="form2.sid == 1">管理层</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="dialogVisible2 = false">取消</el-button>
              <el-button type="primary" @click="submitForm2">确定</el-button>
            </span>
          </el-dialog>
          <!-- ------------------删除弹框（删除自己的账号）----------- -->
          <el-dialog
            title="删除提示"
            :visible.sync="visible"
            width="30%"
            :before-close="handleClose"
          >
            <span>删除当前登录账号，将立即退出登录！确定删除吗？</span>
            <span slot="footer" class="dialog-footer">
              <el-button @click="visible = false">取 消</el-button>
              <el-button type="primary" @click="sureDel()">确 定</el-button>
            </span>
          </el-dialog>
          <!-- ------------------删除弹框（删除下属的账号）----------- -->
          <el-dialog
            title="删除提示"
            :visible.sync="visible2"
            width="30%"
            :before-close="handleClose2"
          >
            <span>删除该账号，将永久失效！确定删除吗？</span>
            <span slot="footer" class="dialog-footer">
              <el-button @click="visible = false">取 消</el-button>
              <el-button type="primary" @click="sureDel2()">确 定</el-button>
            </span>
          </el-dialog>
          <!-- ------------------禁用弹框（禁用自己的账号）----------- -->
          <el-dialog
            title="禁用提示"
            :visible.sync="visible3"
            width="30%"
            :before-close="handleClose3"
          >
            <span>禁用当前登录账号，将立即退出登录！确定禁用吗？</span>
            <span slot="footer" class="dialog-footer">
              <el-button @click="visible3 = false">取 消</el-button>
              <el-button type="primary" @click="sureStop()">确 定</el-button>
            </span>
          </el-dialog>
          <!-- ------------------查看所有的用户----------- -->
          <el-dialog
            title="修改记录"
            :visible.sync="visible4"
            width="60%"
            :before-close="handleClose4"
          >
            <el-table :data="tableData2">
              <!-- ----------------------表格中的数据 -->
              <el-table-column
                prop="account"
                label="账户"
                align="center"
              ></el-table-column>
              <el-table-column
                prop="phone"
                label="手机号"
                align="center"
              ></el-table-column>
              <el-table-column
                prop="sid"
                label="所属部门"
                align="center"
              ></el-table-column>

              <el-table-column
                prop="time"
                label="修改时间"
                align="center"
              ></el-table-column>
              <el-table-column prop="aid" label="操作员id" align="center">
              </el-table-column>
            </el-table>
            <span slot="footer" class="dialog-footer">
              <el-button @click="visible4 = false">关闭</el-button>
            </span>
          </el-dialog>
        </el-tab-pane>
        <!-- --------------------------------------------------------------第二模块----------------------- -->
        <el-tab-pane
          label="特殊设置"
          v-if="
            role.endsWith('m') || role.endsWith('manager') || role.endsWith('x')
          "
        >
          <el-table :data="tableData4" style="width: 100%">
            <el-table-column
              prop="id"
              label="编号"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="account"
              label="账户"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="department"
              label="所属部门"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="description"
              label="账号身份"
              align="center"
            ></el-table-column>
            <el-table-column label="操作" align="center">
              <template slot-scope="scope">
                <el-button @click="EditSpeRole(scope.row)"
                  >设定特殊角色</el-button
                >
              </template>
            </el-table-column>
          </el-table>
          <template>
                  <div class="block">
                    <el-pagination
                      @size-change="handleSizeChange2"
                      @current-change="handleCurrentChange2"
                      :current-page="currentPage2"
                      :page-sizes="[8, 16, 24, 32]"
                      :page-size="pageSize2"
                      layout="prev, pager, next, jumper, sizes, total"
                      :total="tableTotal2"
                    >
                    </el-pagination>
                  </div>
                </template>
          <!-- ---------------------------------------------------设置新的角色 -->
          <el-dialog
            title="角色赋权"
            :visible.sync="dialogVisible6"
            width="80%"
          >
            <el-table
              ref="singleTable"
              :data="tableData6"
              highlight-current-row
              @current-change="handleCurrentChange6"
              style="width: 100%"
            >
              <!-- ----------------------展开行 -->
              <el-table-column type="expand">
                <template slot-scope="props">
                  <el-form
                    label-position="left"
                    inline
                    class="demo-table-expand"
                  >
                    <el-form-item>
                      <span slot="label">
                        <span style="color: darkgray;font-size: 1.3em;"
                          >拥有的操作权限:</span
                        >
                      </span>

                      <span
                        v-for="(activity, index) in props.row.permsList"
                        :key="index"
                        style="margin: 5px;padding: 5px;"
                        >{{ activity.description }}</span
                      >
                    </el-form-item>
                  </el-form>
                </template>
              </el-table-column>

              <!-- ----------------------表格中的数据 -->
              <el-table-column
                prop="id"
                label="角色id"
                align="center"
              ></el-table-column>
              <el-table-column
                prop="name"
                label="名字"
                align="center"
              ></el-table-column>
              <el-table-column
                prop="description"
                label="描述"
                align="center"
              ></el-table-column>
              <el-table-column
                prop="department"
                label="所属部门"
                align="center"
              ></el-table-column>
           
            </el-table>
            <div class="block">
                    <el-pagination
                      @size-change="handleSizeChange1"
                      @current-change="handleCurrentChange1"
                      :current-page="currentPage1"
                      :page-sizes="[10, 20]"
                      :page-size="pageSize1"
                      layout="prev, pager, next, jumper, sizes, total"
                      :total="tableTotal1"
                    >
                    </el-pagination>
                  </div>
            <span slot="footer" class="dialog-footer">
              <el-button @click="dialogVisible6 = false">取消</el-button>
              <el-button type="primary" @click="submitForm6">确定</el-button>
            </span>
          </el-dialog>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      //<!-- --------------------------------------------------------------第一模块----------------------- -->
      //搜索功能中的单选按钮
      radio: "全部",
      //搜索功能的输入关键字
      input: "",
      //表格名
      tableData: [],
      //查看详情表格名
      tableData2: [],
      //分页
      currentPage: 1, // 当前页码
      pageSize: 8, // 每页显示条数
      tableTotal: 0, //总条数
      //用于记录页码改变是因为哪一个方法
      changePage: true,
      //记录分页的第二页之后应该请求的方法
      pageState: 0,
      //停用启用按钮
      value1: true,
      //新增用户的弹框
      dialogVisible: false,

      form: {
        account: "",
        password: "",
        cellphone: "",
        sid: null,
        identity: null
      },
      //编辑用户的弹框
      dialogVisible2: false,
      form2: {
        id: null,
        account: "",
        password: "",
        cellphone: "",
        sid: null,
        identity: null
      },
      //保存该账号的信息
      userAll: null,
      //保存该账号的身份信息
      role: "",
      //保存部门信息
      sector: null,
      //部门的下拉框
      options: [
        {
          id: null,
          name: ""
        }
      ],
      options2: [
        {
          id: null,
          name: ""
        }
      ],
      value: "",
      //删除弹框
      visible: false,
      visible2: false,
      visible3: false,
      visible4: false,
      //记录选择行的id
      uid: null,
      stopId: null,
      managerNum: 0,
      editSid: 0,
      //<!-- --------------------------------------------------------------第二模块----------------------- -->
      tableData4: [],
      //角色选择表
      tableData6: [],
      //修改角色的弹框
      dialogVisible6:false,
      currentRow: null,
      //分页
      currentPage1: 1, // 当前页码
      pageSize1: 8, // 每页显示条数
      tableTotal1: 0, //总条数
      speUid:0,
        //分页
      currentPage2: 1, // 当前页码
      pageSize2: 8, // 每页显示条数
      tableTotal2: 0, //总条数
    };
  },
  methods: {
    //<!-- --------------------------------------------------------------第一模块----------------------- -->
    //刷新功能
    clearItem: function() {
      this.radio = "全部";
      this.input = "";
      this.getTableData();
      this.pageState = 0;
    },
    // 获取表格数据的方法，这里假设通过异步请求从服务器获取数据
    getTableData() {
      this.$axios
        .get("/user/findall2/" + this.currentPage + "/" + this.pageSize)
        .then(res => {
          console.log(res.data.data.pageList);
          this.tableData = res.data.data.pageList;
          this.tableTotal = res.data.data.totalCount;
        });
    },
    handleSizeChange(val) {
      // 页面大小修改时触发
      console.log(`每页 ${val} 条`);
      this.pageSize = val;
      this.getTableData();
    },
    handleCurrentChange(val) {
      // 页码修改时触发
      console.log(`当前页: ${val}`);
      // 给当前页属性赋值
      this.currentPage = val;
      var num = this.pageState;
      if (num == 0) {
        this.getTableData();
      } else if (num == 2) {
        this.all2();
      } else if (num == 3) {
        this.searchAll2();
      }
    },
    // 编辑操作
    handleEdit(row) {
      this.findManager();
      console.log("编辑操作", row);
      console.log(row.roleList[0].name.slice(0, 4));
      // ...
      this.editSid = row.sid;
      this.form2.id = row.id;
      this.dialogVisible2 = true;
      this.findSector2();
    },
    // 删除操作
    handleDelete(row) {
      this.findManager();
      console.log(this.managerNum);
      if (this.managerNum == 1) {
        this.$message.error(
          "目前管理员只有一位，不能进行状态或者角色操作！！！！！"
        );
        return;
      } else {
        console.log(row);
        if (this.userAll.account == row.account) {
          this.visible = true;
          this.uid = row.id;
        } else {
          this.visible2 = true;
          this.uid = row.id;
        }
      }
    },
    //删除账号
    sureDel: function() {
      this.$axios.get("/user/delUser/" + this.uid).then(res => {
        console.log(res);
        if (res.status == 200) {
          this.$router.push("/");
          this.visible = false;
        }
      });
    },
    //删除账号的取消确定
    handleClose(done) {
      this.$confirm("确认关闭？")
        .then(_ => {
          done();
        })
        .catch(_ => {});
    },
    //编辑账号
    sureDel2: function() {
      this.$axios.get("/user/delUser/" + this.uid).then(res => {
        console.log(res);
        if (res.status == 200) {
          this.visible2 = false;
          this.getTableData();
        }
      });
    },
    //编辑账号的取消确定
    handleClose2(done) {
      this.$confirm("确认关闭？")
        .then(_ => {
          done();
        })
        .catch(_ => {});
    },
    //状态修改方法
    modifyState(row) {
      console.log(row);
      this.findManager();
      console.log(this.managerNum);
      if (this.managerNum == 1 &&  row.sid==1&&row.status==false) {
        this.$message.error(
          "目前管理员只有一位，不能进行状态或者角色操作！！！！！"
        );

        return;
      } else {
        console.log("修改状态成功", row);
        if (row.status) {
          this.$axios.get("/user/openUser/" + row.id).then(res => {
            if (res.status == 200) {
              this.$message.success("启用成功");
            }
          });
        } else {
          if (row.account == window.localStorage.getItem("account")) {
            this.visible3 = true;
            this.stopId = row.id;
          } else {
            this.$axios.get("/user/stopUser/" + row.id).then(res => {
              if (res.status == 200) {
                this.$message.success("禁用成功");
              }
            });
          }
        }
      }
    },
    //禁用自己账户
    sureStop: function() {
      this.$axios.get("/user/stopUser/" + this.stopId).then(res => {
        if (res.status == 200) {
          this.visible3 = false;
          this.$router.push("/");
        }
      });
    },
    //禁用账号的取消确定
    handleClose3(done) {
      this.$confirm("确认关闭？")
        .then(_ => {
          done();
        })
        .catch(_ => {});
    },
    //查看详情退出
    handleClose4() {
      this.visible4 = false;
    },
    //新增用户的方法
    addCount: function() {
      this.dialogVisible = true;
      this.findSector();
    },
    //新增用户的弹框
    submitForm: function() {
      if (!this.form.cellphone.match(/^\d{11}$/)) {
        this.$message.error("手机号必须是11位");
        return;
      }

      // 提交表单数据到后端
      console.log("提交表单数据：", this.form);
      this.$axios.post("/user/addUser", this.form).then(res => {
        if (res.status == 200) {
          this.$message.success("新增账号成功");
        }
      });

      this.dialogVisible = false;
    },
    //编辑用户的弹框
    submitForm2: function() {
      if (!this.form.cellphone.match(/^\d{11}$/) && this.form.cellphone != "") {
        this.$message.error("手机号必须是11位");
        return;
      }

      // 提交表单数据到后端
      console.log("提交表单数据：", this.form2);
      this.$axios.post("/user/updateUser", this.form2).then(res => {
        if (res.status == 200) {
          this.$message.success("修改账号成功");
          this.form2.account=''
          this.form2.cellphone=''
          this.form2.sid=''
          this.getTableData();
        }
      });
      this.dialogVisible2 = false;
    },
    //查找有哪些部门
    findSector: function() {
      this.$axios.get("/systemSector/findAll").then(res => {
        console.log(res.data);
        this.options = res.data.data;

        if (this.userAll.sid == 2) {
          console.log(1);
          for (let index = this.options.length - 1; index >= 0; index--) {
            if (this.options[index].name == "salew") {
              this.options[index].name = "销售部门";
            } else {
              this.options.splice(index, 1);
            }
          }
        } else if (this.userAll.sid == 3) {
          console.log(2);
          var aaa = this.options;
          for (let index = this.options.length - 1; index >= 0; index--) {
            console.log(this.options.length);
            if (this.options[index].name == "financew") {
              this.options[index].name = "财务部门";
            } else {
              this.options.splice(index, 1);
            }
          }
        } else if (this.userAll.sid == 4) {
          console.log(3);
          for (let index = this.options.length - 1; index >= 0; index--) {
            if (this.options[index].name == "buyw") {
              this.options[index].name = "采购部门";
            } else {
              this.options.splice(index, 1);
            }
          }
        } else if (this.userAll.sid == 6) {
          console.log(4);
          for (let index = this.options.length - 1; index >= 0; index--) {
            if (this.options[index].name == "goodsw") {
              this.options[index].name = "产品部门";
            } else {
              this.options.splice(index, 1);
            }
          }
        } else if (this.userAll.sid == 5) {
          console.log(5);
          for (let index = this.options.length - 1; index >= 0; index--) {
            if (this.options[index].name == "depotw") {
              this.options[index].name = "仓库部门";
            } else {
              this.options.splice(index, 1);
            }
          }
        } else if (this.userAll.sid == 7) {
          console.log(6);
          for (let index = this.options.length - 1; index >= 0; index--) {
            if (this.options[index].name == "comw") {
              this.options[index].name = "商务部门";
            } else {
              this.options.splice(index, 1);
            }
          }
        } else if (this.userAll.sid == 1) {
          for (let index = this.options.length - 1; index >= 0; index--) {
            if (this.options[index].name == "comw") {
              this.options[index].name = "商务部门";
            } else if (this.options[index].name == "financew") {
              this.options[index].name = "财务部门";
            } else if (this.options[index].name == "buyw") {
              this.options[index].name = "采购部门";
            } else if (this.options[index].name == "goodsw") {
              this.options[index].name = "产品部门";
            } else if (this.options[index].name == "depotw") {
              this.options[index].name = "仓库部门";
            } else if (this.options[index].name == "salew") {
              this.options[index].name = "销售部门";
            } else if (this.options[index].name == "manager") {
              this.options[index].name = "管理层";
            }
          }
        }
      });
    },
    //查找有哪些部门
    findSector2: function() {
      this.$axios.get("/systemSector/findAll").then(res => {
        console.log(res.data);
        this.options2 = res.data.data;

        if (this.userAll.sid == 1) {
          for (let index = this.options2.length - 1; index >= 0; index--) {
            if (this.options2[index].name == "comw") {
              this.options2[index].name = "商务部门";
            } else if (this.options2[index].name == "financew") {
              this.options2[index].name = "财务部门";
            } else if (this.options2[index].name == "buyw") {
              this.options2[index].name = "采购部门";
            } else if (this.options2[index].name == "goodsw") {
              this.options2[index].name = "产品部门";
            } else if (this.options2[index].name == "depotw") {
              this.options2[index].name = "仓库部门";
            } else if (this.options2[index].name == "salew") {
              this.options2[index].name = "销售部门";
            } else if (this.options2[index].name == "manager") {
              this.options2[index].name = "管理层";
            }
          }
        } else if (this.userAll.sid != 1) {
          for (let index = this.options2.length - 1; index >= 0; index--) {
            if (this.options2[index].name == "comw") {
              this.options2[index].name = "商务部门";
            } else if (this.options2[index].name == "financew") {
              this.options2[index].name = "财务部门";
            } else if (this.options2[index].name == "buyw") {
              this.options2[index].name = "采购部门";
            } else if (this.options2[index].name == "goodsw") {
              this.options2[index].name = "产品部门";
            } else if (this.options2[index].name == "depotw") {
              this.options2[index].name = "仓库部门";
            } else if (this.options2[index].name == "salew") {
              this.options2[index].name = "销售部门";
            } else if (this.options2[index].name == "manager") {
              this.options2.splice(index, 1);
            }
          }
        }
      });
    },
    all(value) {
      this.pageState = 2;
      this.all2(value);
    },
    //根据搜索中的单选按钮查看状态
    all2(value) {
      this.input = "";
      console.log(value);
      if (value == "全部") {
        this.getTableData();
      } else if (value == "启用") {
        this.$axios
          .get("/user/findStateOpen/" + this.currentPage + "/" + this.pageSize)
          .then(res => {
            this.tableData = res.data.data.pageList;
            this.tableTotal = res.data.data.totalCount;
          });
      } else if (value == "禁用") {
        this.$axios
          .get("/user/findStateClose/" + this.currentPage + "/" + this.pageSize)
          .then(res => {
            this.tableData = res.data.data.pageList;
            this.tableTotal = res.data.data.totalCount;
          });
      }
    },
    //多条件查询
    searchAll: function() {
      this.pageState = 3;
      this.searchAll2();
    },

    searchAll2: function() {
      var num = 5;
      if (this.radio == "全部") {
        num = 3;
      } else if (this.radio == "启用") {
        num = 0;
      } else if (this.radio == "禁用") {
        num = 1;
      }
      this.$axios
        .get(
          "/user/searchAll/" +
            num +
            "/" +
            this.input +
            "/" +
            this.currentPage +
            "/" +
            this.pageSize
        )
        .then(res => {
          this.tableData = res.data.data.pageList;
          this.tableTotal = res.data.data.totalCount;
        });
    },
    //查看所有的修改历史
    searchHistory: function(row) {
      this.visible4 = true;
      this.$axios.get("/user/searchHistory/" + row.account).then(res => {
        console.log(res.data.data);
        var pageList = res.data.data;
        this.tableData2 = res.data.data;
        for (var i = 0; i < pageList.length; i++) {
          if (pageList[i].sid == "1") {
            pageList[i].sid = "管理层";
          } else if (pageList[i].sid == "2") {
            pageList[i].sid = "销售部门";
          } else if (pageList[i].sid == "3") {
            pageList[i].sid = "财务部门";
          } else if (pageList[i].sid == "4") {
            pageList[i].sid = "采购部门";
          } else if (pageList[i].sid == "5") {
            pageList[i].sid = "仓库部门";
          } else if (pageList[i].sid == "6") {
            pageList[i].sid = "产品部门";
          } else if (pageList[i].sid == "7") {
            pageList[i].sid = "商务部门";
          }
        }
        console.log(pageList);
         this.tableData2=pageList
      });
    },
    //查询管理员有几个
    findManager: function() {
      this.$axios.get("/user/findManager").then(res => {
        this.managerNum = 0
        console.log(res.data.data);
        if (res.data.data.length < 2) {
          this.managerNum = 1;
          console.log(this.managerNum);
        }
      });
    },
    //<!-- --------------------------------------------------------------第二模块----------------------- -->
    //查找所有的账号
    findSpeUser: function() {
      this.$axios
        .get("/user/findSpeUser/" + this.currentPage2 + "/" + this.pageSize2+"/" + window.localStorage.getItem("account"))
        .then(res => {
          console.log(res.data.data);
          this.tableData4 = res.data.data.pageList;
          this.tableTotal2 = res.data.data.totalCount;
        });
    },
    getTableData6() {
      this.$axios
        .get("/role/findAllRole3/" + this.currentPage1 + "/" + this.pageSize1)
        .then(res => {
          console.log(res.data.data.pageList);
          this.tableData6 = res.data.data.pageList;
          this.tableTotal1 = res.data.data.totalCount;
        });
    },
    //选择角色事件
    setCurrent(row) {
      this.$refs.singleTable.setCurrentRow(row);
    },
    handleCurrentChange6(val) {
      console.log(val);
      this.currentRow = val;
    },
    EditSpeRole:function (row) {
      this.dialogVisible6=true;
      this.speUid=row.id
      this.getTableData6();
    },
    handleSizeChange1(val) {
      // 页面大小修改时触发
      console.log(`每页 ${val} 条`);
      this.pageSize1 = val;
      this.getTableData6();
    },
    handleCurrentChange1(val) {
      // 页码修改时触发
      console.log(`当前页: ${val}`);
      // 给当前页属性赋值
      this.currentPage1 = val;
      this.getTableData6();
    },
    handleSizeChange2(val) {
      // 页面大小修改时触发
      console.log(`每页 ${val} 条`);
      this.pageSize2 = val;
      this.findSpeUser();
    },
    handleCurrentChange2(val) {
      // 页码修改时触发
      console.log(`当前页: ${val}`);
      // 给当前页属性赋值
      this.currentPage2= val;
      this.findSpeUser();
    },
     //编辑用户的弹框
     submitForm6: function() {
      this.$axios.get("/user/updateNewRoleUser/"+this.currentRow.rid+"/"+this.speUid).then(res => {
        if (res.status == 200) {
          this.$message.success("修改角色成功");
        }
      });
      this.dialogVisible6 = false;
    },

  },
  mounted: function() {
    this.getTableData();
    this.getTableData6();
    this.findSpeUser();
    this.$axios
      .get("/user/findUserByAccount/" + window.localStorage.getItem("account"))
      .then(res => {
        console.log(res.data.data);
        this.userAll = res.data.data;
        this.role = res.data.data.roleList[0].name;
        console.log(this.role);
      });
    this.findManager();
  }
};
</script>

<style scoped>
.demo-table-expand {
  font-size: 0;
  background-color: #ddf1da;
}

.demo-table-expand label {
  width: 90px;
}

.demo-table-expand .el-form-item {
  margin-right: 0;
  margin-bottom: 0;
  width: 100%;
}
</style>
